<template>
	<div class="x-mt-l">
		<a-row type="flex" justify="center">
			<a-col :xs="24" :md="8">
				<div class="x-bg-white">
					<a-menu v-model="current" class="x-pl-xxl x-pt-l x-pr-xxl x-text-center" mode="horizontal">
						<a-menu-item key="login">登录</a-menu-item>
						<a-menu-item key="register">注册</a-menu-item>
					</a-menu>
					<a-form-model v-if="current[0] == 'login'" class="x-p-xl x-text-center" :model="form" :label-col="labelCol" :wrapper-col="wrapperCol">
						<a-form-model-item><a-input placeholder="请输入用户名" v-model="form.name" /></a-form-model-item>
						<a-form-model-item><a-input placeholder="请输入密码" v-model="form.name" /></a-form-model-item>
						<a-form-model-item :wrapper-col="{ span: 14, offset: 4 }"><a-button type="primary" @click="onSubmit">登录</a-button></a-form-model-item>
					</a-form-model>
					<a-form-model v-if="current[0] == 'register'" class="x-p-xl x-text-center" :model="form" :label-col="labelCol" :wrapper-col="wrapperCol">
						<a-form-model-item><a-input placeholder="请输入用户名" v-model="form.name" /></a-form-model-item>
						<a-form-model-item><a-input placeholder="请输入密码" v-model="form.name" /></a-form-model-item>
						<a-form-model-item :wrapper-col="{ span: 14, offset: 4 }"><a-button type="primary" @click="onSubmit">注册</a-button></a-form-model-item>
					</a-form-model>
				</div>
			</a-col>
		</a-row>
	</div>
</template>

<script>
export default {
	data() {
		return {
			form: {
				name: '',
				region: undefined,
				date1: undefined,
				delivery: false,
				type: [],
				resource: '',
				desc: ''
			},
			current: ['login']
		};
	},
	methods: {
		onSubmit() {
			console.log('submit!', this.form);
		}
	}
};
</script>

<style scoped></style>
